<!doctype html>
<html lang="zh">
<head>
  <meta charset="UTF-8">
  <title>arale测试</title>

  <style>
    .fn-hide, .ui-popup {
      display: none;
    }
    .ui-popup {
      border: 1px solid #CCC;
      padding: 3px 5px;
      background: #EEE;
      margin: 0;
    }
    .ui-popup li {
      list-style: none;
    }
  </style>
</head>
<body style="margin:100px 200px">

<div class="popup">
  <a href="#popup3" id="triggerId3">下拉框<span class="icon">▼</span></a>
  <ul class="fn-hide ui-popup" id="popup3">
    <li><a href="http://aralejs.org#1">内容1</a></li>
    <li><a href="http://aralejs.org#3">内容2</a></li>
    <li><a href="http://aralejs.org#3">内容3</a></li>
    <li><a href="http://aralejs.org#4">内容4</a></li>
  </ul>
</div>

<script src="../sea-modules/seajs/seajs/2.2.1/sea.js"></script>
<script>
  seajs.config({
    base: "../sea-modules",
    alias: {
      "$": "jquery/jquery/2.1.0/jquery",
      "$-debug": "jquery/jquery/2.1.0/jquery-debug",
      "popup": "arale/popup/1.1.6/popup",
      "popup-debug": "arale/popup/1.1.6/popup-debug"
    }
  });

  seajs.use(['popup-debug'],function(Popup){
    var example3 = new Popup({
      trigger: '#triggerId3',
      triggerType: 'click',
      align: {
        baseXY: [0, 80]
      },
      element: '#popup3'
    });
  });
</script>
</body>
</html>